import { FC, useState } from 'react'
import QuestionCard from '../../components/QuestionCard'
import styles from './List.module.scss'

const rowList = [
    {
        _id: 'q1',
        title: '问卷1',
        isPublished: false,
        isStar: false,
        answerCount: 5,
        createdAt: '3月10日13:23',
    },
    {
        _id: 'q2',
        title: '问卷2',
        isPublished: true,
        isStar: true,
        answerCount: 15,
        createdAt: '3月11日13:23',
    },
    {
        _id: 'q3',
        title: '问卷3',
        isPublished: false,
        isStar: false,
        answerCount: 25,
        createdAt: '3月12日13:23',
    },
    {
        _id: 'q4',
        title: '问卷4',
        isPublished: false,
        isStar: false,
        answerCount: 25,
        createdAt: '3月12日13:56',
    },
]

const List: FC = () => {
    const [list, setList] = useState(rowList)
    return (
        <div className={styles.container}>
            <div className={styles.header}>
                <h1>我的问卷</h1>
                <div className='search'>
                    <input type='text' placeholder='请输入标题' />
                </div>
            </div>
            <div className={styles.content}>
                {list.map((item) => {
                    const id = item._id
                    return <QuestionCard key={id} {...item}></QuestionCard>
                })}
            </div>
            <div className={styles.footer}>
                <div>分页</div>
            </div>
        </div>
    )
}

export default List
